<template>
  <div class="list">

    <app-head title="游戏列表"></app-head>

    <div class="search__result" v-if="search && !gameList.count">
      暂无搜索结果
    </div>

    <scroll :data="gameList" :action="listAction" :params="listParams" v-else>
      <GameList slot="scrollInner" :content="gameList.list" direction="column" item="full" :type="type"/>
    </scroll>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import Scroll from '@/components/common/Scroll'
import GameList from '@/components/game/List'

export default {
  name: 'gameList',
  components: {
    Scroll,
    GameList
  },
  computed: {
    ...mapGetters([
      'gameList'
    ])
  },
  data () {
    return {
      listAction: '',
      listParams: {},
      type: '',
      search: false
    }
  },
  created () {
    let { id, type, search } = this.$route.query
    this.type = type
    if (id) {
      this.listAction = 'getGameList'
      this.listParams.topic_id = id
      this.$store.dispatch('getGameList', this.listParams)
    } else if (search) {
      this.search = true
      this.listAction = 'searchGameList'
      this.listParams.keywords = search
      this.$store.dispatch('searchGameList', this.listParams)
    }
  }
}
</script>

<style scoped lang="scss">
.search__result {
  color: #999;
  font-size: 0.14rem;
  margin: 0.5rem 0;
  text-align: center;
}
</style>
